*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:Arial;
}

/* Header */

.hotel-title{
text-align:center;
background:orange;
color:white;
padding:15px;
}

/* Navbar */

.topnav{
overflow:hidden;
background:#87CEEB;
}

.topnav a{
float:left;
display:block;
color:white;
padding:14px 16px;
text-decoration:none;
}

.topnav a:hover{
background:#D6EAF8;
color:black;
}

.topnav .icon{
display:none;
}

/* Mobile Navbar */

@media screen and (max-width:768px){

.topnav a:not(:first-child){
display:none;
}

.topnav a.icon{
float:right;
display:block;
}

.topnav.responsive{
position:relative;
}

.topnav.responsive a{
float:none;
display:block;
}

}

/* Slider */

.slider{
width:100%;
}

.slides img{
width:100%;
height:500px;
object-fit:cover;
}

/* About Section */

.about-section{
display:flex;
align-items:center;
justify-content:space-between;
padding:40px;
gap:20px;
}

.text-content{
width:60%;
}

.green-heading{
color:#2e8b57;
}

.grey-text{
line-height:1.7;
color:#555;
}

/* Image */

.image-content{
width:40%;
text-align:right;
}

.image-content img{
width:100%;
max-width:400px;
border-radius:15px;
}

/* Mobile Side Layout */

@media(max-width:768px){

.about-section{
flex-direction:row;
padding:20px;
}

.text-content{
width:60%;
}

.image-content{
width:40%;
}

.slides img{
height:250px;
}

}

/* Footer */

.footer{
background:#003366;
padding:30px 0;
}

.container{
max-width:1100px;
margin:auto;
}

.footer-row{
display:flex;
flex-wrap:wrap;
}

.footer-col{
width:25%;
padding:15px;
}

.footer-col h4{
color:white;
margin-bottom:15px;
}

.footer-col ul{
list-style:none;
}

.footer-col ul li{
margin:8px 0;
}

.footer-col ul li a{
color:#bbb;
text-decoration:none;
}

.footer-col ul li a:hover{
color:white;
}

.social-links a{
display:inline-block;
width:40px;
height:40px;
background:rgba(255,255,255,0.2);
text-align:center;
line-height:40px;
border-radius:50%;
color:white;
}

/* Footer Mobile */

@media(max-width:768px){

.footer-col{
width:50%;
}

}

@media(max-width:500px){

.footer-col{
width:100%;
}

